

var myChart = echarts.init(document.getElementById("main"));
var myChart2 = echarts.init(document.getElementById("main2"));
var way = echarts.init(document.getElementById("way"));
var gold = echarts.init(document.getElementById("gold"));
var arr = ['8.23', '8.24', '8.25', '8.26', '8.27', '8.28', '8.29', '8.23', '8.24', '8.25', '8.26', '8.27', '8.28', '8.29'];
option = {
  backgroundColor: "#fff",
  tooltip: {
    trigger: 'axis',
    
  },
  grid: {
    show: true,
    left: '1%',
    right: '2%',
    bottom: '4%',
    containLabel: true,
  },
  xAxis: [
    {
      type: 'category',
      boundaryGap: false,
      data: arr
    }
  ],
  yAxis: [
    {
      type: 'value'
    }
  ],
  color: ['#2f6f95'],
  series: [
    {
      name: '邮件营销',
      type: 'line',
      stack: '总量',
      smooth: true,
      lineStyle: {
        normal: {
          color: "#2f6f95"
        }
      },
      areaStyle: {
        normal: {
          color: "#96cceb"
        }
      },
      data: [120, 132, 101, 134, 90, 230, 210, 120, 132, 101, 134, 90, 230, 210],
    }
  ]
};
option2 = {
  backgroundColor: "#fff",
  tooltip: {
    trigger: 'axis',
    
  },
  grid: {
    show: true,
    left: '1%',
    right: '2%',
    bottom: '4%',
    containLabel: true,
  },
  xAxis: [
    {
      type: 'category',
      boundaryGap: false,
      data: arr
    }
  ],
  yAxis: [
    {
      type: 'value'
    }
  ],
  color: ['#2f6f95'],
  series: [
    {
      name: '邮件营销',
      type: 'line',
      stack: '总量',
      smooth: true,
      lineStyle: {
        normal: {
          color: "#2f6f95"
        }
      },
      areaStyle: {
        normal: {
          color: "#96cceb"
        }
      },
      data: [120, 132, 101, 134, 90, 230, 210, 120, 132, 101, 134, 90, 230, 210],
    }
  ]
};
wayOption = {
  backgroundColor: "#fff",
  tooltip: {
    trigger: 'item',
    formatter: "{a} <br/>{b} : {c} ({d}%)"
  },
  legend: {
    orient: 'vertical',
    left: 'left',
    data: ['代金券汇总', '藏宝汇总', '挖宝箱汇总'],
    formatter: '{name}-100万 '
  },
  series: [
    {
      type: 'pie',
      radius: ['30%', '70%'],
      center: ['50%', '50%'],
      label: {
        normal: {
          formatter: '{b}:{d}%',
        }
      },
      data: [
        {value: 335, name: '代金券汇总'},
        {value: 310, name: '藏宝汇总'},
        {value: 234, name: '挖宝箱汇总'},
      
      ],
    }
  ]
};
goldOption = {
  backgroundColor: "#fff",
  tooltip: {
    trigger: 'axis',
    
  },
  grid: {
    show: true,
    left: '1%',
    right: '2%',
    bottom: '4%',
    containLabel: true,
  },
  xAxis: [
    {
      type: 'category',
      boundaryGap: false,
      data: arr
    }
  ],
  yAxis: [
    {
      type: 'value'
    }
  ],
  color: ['#2f6f95'],
  series: [
    {
      name: '邮件营销',
      type: 'line',
      stack: '总量',
      smooth: true,
      lineStyle: {
        normal: {
          color: "#2f6f95"
        }
      },
      areaStyle: {
        normal: {
          color: "#96cceb"
        }
      },
      data: [120, 132, 101, 134, 90, 230, 210, 120, 132, 101, 134, 90, 230, 210],
    }
  ]
};

// 使用刚指定的配置项和数据显示图表。
myChart.setOption(option);
myChart2.setOption(option2);
way.setOption(wayOption);
gold.setOption(goldOption)
window.addEventListener("resize", function () {
  myChart.resize();
  myChart2.resize();
  way.resize();
  gold.resize()
})
